<template>
  <div class="map-contant">
    <slot></slot>
  </div>
</template>
<script>
// -------------- 初始化 -------------------
import InitMapMixin from "../mixins/initmap"
// -------------- 图层 ----------------
import {addSatellite, hiddenSatellite, showSatelite} from "../TileLayer/addSatellite"
// -------------- 其他功能 -------------
import {addMassMark, updateMassmark} from "../MassMark/main" //海量点

export default {
  mixins: [InitMapMixin],
  data() {
    return {
      Satellite: undefined
    }
  },
  mounted() {
    if (this.showSatelite) {
      this.Satellite = addSatellite(this.map);
    }
    addMassMark(this.map, [this.mark], this);
  },
  props: {
    mark: {
      type: Object,
      default: () => {
        return {lnglat: [116.344446, 39.919251], markName: "坐标四"}
      }
    },
    showSatelite: {
      type: Boolean,
      default: true
    }
  },
  watch: {
    mark: function (val) {
      if (val.lnglat === undefined) {
        this.map.setCenter(this.mapInfo.center);
        this.map.setZoom(this.mapInfo.zoom);
      }
      updateMassmark(this.map, [val], this);
    },
    showSatelite: function (val) {
      if (val) {
        showSatelite(this.Satellite);
      } else {
        hiddenSatellite(this.Satellite);
      }
    }
  }
};
</script>
<style scoped>
.map-contant {
  height: 100%;
  width: 100%;
}
</style>
